<template>
    <div class="mainchatcontent-contrainer">
        <!-- 这里是头部，显示聊天人的姓名 -->
        <my-header>
            <!-- {{route.query.nickname}} -->
            {{route.params.id}}
        </my-header>
        <!-- 这里是输入法    -->
        <my-input class="my-input">

        </my-input>
    </div>
</template>

<script>
// todo 接下来在聊天界面实现websocket
// todo 接收消息，好与后端调试！
// 可以拿到要聊天人的 ID
import MyHeader from '../components/Header.vue'
import MyInput from '../components/MyInput.vue'
import {NDrawer, NIcon} from 'naive-ui'
// import {} from '@vicons/ionicons5'
import {useRoute} from 'vue-router'
import {provide} from 'vue'
export default {
    components:{
        NDrawer,NIcon,
        MyHeader,MyInput
    },
    setup(){
        const route = useRoute()
        // 防止用户手欠刷新聊天页面
        // localStorage.setItem("chatFriendId", (route.params.id).toString())
        // let url = `ws://localhost:8888/v1/contact/friend/${localStorage.getItem("chatFriendId")}`
        // provide("url",url )
        return {
            route
        }
        }
}
</script>

<style>
.mainchatcontent-contrainer{
    height: 100vh;
    position: relative;
}
.my-input{
    position: absolute;
    bottom: 0;
    left:0;
}

</style>
